import React, { Component } from 'react';
import moment from 'moment';  //time格式工厂
import style from './SetModel.less'
import { connect } from 'dva';
import { FormattedMessage, formatMessage } from 'umi/locale'; //此方法引入的数据可以在src/locales中配置
import {
  Button,
  Input,
  DatePicker,
  Form,
  Row,
  Col,
  Table,
  Modal,
  Select,
  Card,
  PageHeader,
  Alert,
  Pagination,
  Upload,
  message,
  Icon,
  Tree,
  Checkbox,
} from 'antd';

const { TreeNode } = Tree;

//命名空间
const namespace = 'RoleManage';

const mapDispatchToProps = function(dispatch) {
  return {
    dispatch: dispatch
  };
};
// 废弃
@connect( mapDispatchToProps)
class setModel extends React.Component {
    constructor (props){
        super(props);
    }
    componentDidMount() {
      const {permissionIdNow,permissionDict} = this.props
      let permissions = permissionIdNow;
      let halfCheckKey = [];
      if(permissions && permissions.length>0){
        permissions= permissions.filter((value)=>{
          if(permissionDict && permissionDict.length>0){
            if(permissionDict.indexOf(value) != -1){
              halfCheckKey.push(value)
            }
            return permissionDict.indexOf(value) === -1;
          }
        })
      }
      //console.log("halfCheckKey")
      this.setState({
        permissionIdNow: permissions,
        halfCheckKey:halfCheckKey
      })
    }
    state = {
        expandedKeys: [],  //展开的父节点
        autoExpandParent: true,   //是否自动展开父节点
        checkedKeys: [],   //默认选中的父节点
        selectedKeys: [],        //设置选中的父节点
        //默认选中的权限内容
        permissionIdNow: [],

    }


    onExpand = (expandedKeys) => {
      this.setState({
        expandedKeys,
        autoExpandParent: false,
      });
    }

    onCheck = (checkedKeys,checkNode) => {
      this.setState({
        permissionIdNow: [...checkedKeys],
        halfCheckKey : checkNode.halfCheckedKeys
      });
    }

    onSelect = (selectedKeys, info) => {
      this.setState({ selectedKeys});
    }

    // componentWillReceiveProps (nextProps){
    //   if(this.props.permissionIdNow !== nextProps.permissionIdNow){
    //     this.setState({
    //       permissionIdNow: nextProps.permissionIdNow
    //     })
    //   }
    // }

    //设置权限
    setPermission = () => {
      let end = this.state.permissionIdNow;
      //console.log(" this.state.halfCheckKey=="+JSON.stringify(this.state.halfCheckKey))
      end=end.concat( this.state.halfCheckKey);
      for(let i=0; i<end.length; i++){
        if(end[i] === 'all'){
          end.splice(i,1);
        }
      }
      const end2 = end.join(',');
      //console.log("end2=="+end2)
      const { dispatch } = this.props;
      dispatch({
        type: `${namespace}/editBegin`,
        payload: {
          role_id: this.props.nowRow?this.props.nowRow.role_id:null,
          permission_id: end2,
        },
        callback: (res) => {
          if(res.return_code === "SUCCESS"){
            message.success('设置成功');
            dispatch({
              type: `${namespace}/selectBegin`,
              payload: {
                page_size: this.props.page_size,
                page_num: this.props.page_num,
                ...this.props.searchFormNow,
              }
            });
          }
          this.props.setCancel();
        }
      })

    }

    //直接渲染树函数
    renderTreeNodes = data => data.map((item) => {
      if (item.permissions) {
        return (
          <TreeNode title={item.permission_name} key={item.permission_id} dataRef={item}>
            {this.renderTreeNodes(item.permissions)}
          </TreeNode>
        );
      }else{
        return (
          <TreeNode title={item.permission_name} key={item.permission_id} dataRef={item}>
          </TreeNode>
        );
      }
    })

    render(){
        //树级数据
        const treeData = this.props.permission_tree?this.props.permission_tree:[];

        return (

            <div>
                <Modal
                visible={this.props.setModelState}
                title="设置权限"
                onCancel={this.props.setCancel}
                destroyOnClose={true}
                maskClosable={false}
                width='700px'
                footer={[
                    <Button
                    key="submit"
                    type="primary"
                    onClick={this.setPermission}
                    >
                    确定
                    </Button>,
                ]}>
                {/* 行1 */}
                <Tree
                    checkable
                    defaultExpandAll={true}
                    onCheck={this.onCheck}
                    checkedKeys={this.state.permissionIdNow}
                >
                  <TreeNode title={`全选`} key={`all`} dataRef={``}>
                    {this.renderTreeNodes(treeData)}
                  </TreeNode>
                </Tree>
                </Modal>
            </div>
        )

    }
}

export default setModel;
